<?php
/**
 * Created by PhpStorm.
 * User: 67569
 * Date: 2018/5/3
 * Time: 17:23
 */
?>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>wangEditor demo</title>
</head>
<link rel="stylesheet" href="css/admin.css">
<script src="js/jquery.js"></script>
<script src="js/pintuer.js"></script>
<style>
    .input {
        font-size: 14px;
        padding: 10px;
        border: solid 1px #ddd;
        width: 100%;
        line-height: 20px;
        display: block;
        border-radius: 3px;
        -webkit-appearance: none;
    }

    .input:focus {
        border-color: #0ae;
        transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1) 0s;
    }

    .button {
        border: solid 1px #ddd;
        background: transparent;
        border-radius: 4px;
        font-size: 14px;
        padding: 6px 15px;
        margin: 0;
        display: inline-block;
        line-height: 20px;
        transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1) 0s;
    }

    .button[disabled] {
        pointer-events: none;
        cursor: not-allowed;
        webkit-box-shadow: none;
        box-shadow: none;
        filter: alpha(opacity=50);
        opacity: .5;
    }

    .button:active {
        background-image: none;
        outline: 0;
        transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1) 0s;
    }

    .button:hover {
        transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1) 0s;
    }

    .button.bg-main, .button.bg-sub, .button.bg-dot, .button.bg-black, .button.bg-gray, .button.bg-red, .button.bg-yellow, .button.bg-blue, .button.bg-green {
        color: #fff;
    }

    .button.bg-main.icon-check-square-o {
        padding: 10px 30px;
    }

    .button.bg-main.icon-check-square-o:hover {
        background: #08bbe1;
    }

    .button:hover, .button:focus, .button.bg:hover, .button.bg:focus {
        background-color: #f5f5f5;
    }

</style>
<body>
<script type="text/javascript">
    function  showImg(){
        document.getElementById("wxImg").style.display='block';
    }
    function hideImg(){
        document.getElementById("wxImg").style.display='none';
    }
</script>
<?php
session_start();
header('Content-type:text/html;charset=utf8');
require_once('pdo.php');

$sqlGetNewsType = "select * from news_type_info a where a.status = '1' order by uid asc";
$rsGetNewsType = $pdo->query($sqlGetNewsType);
$resultGetNewsType = $rsGetNewsType->fetch(PDO::FETCH_ASSOC);
?>
<form action="newsEditCheck.php" method="post">
    <div class="form-group" style="float:left; display: inline" >
        <div class="label">
            <strong style="font-size: 16px">文章标题:</strong>
        </div>
        <div style="height: 15px;"></div>
        <div style="float: left;">
            <input type="text" class="input" name="newsTitle" size="50" placeholder="请输入文章标题" />
        </div>
    </div>

    <div class="form-group" style="float:left;margin-left: 60px;">
        <div class="label">
            <strong style="font-size: 16px">作者:</strong>
        </div>
        <div style="height: 15px;"></div>
        <div style="float: left;">
            <input type="text" class="input" name="newsAuthor" style="width: 180px;" size="50" placeholder="请输入文章作者"/>
        </div>
    </div>

    <div class="clear"></div>
    <div style="height: 15px;"></div>
    <div class="form-group" >
        <div class="label">
            <strong style="font-size: 16px">文章类型:</strong>
        </div>
        <div style="height: 15px;"></div>
        <div class="field">
            <select class="input" name="newsType" style="width: 200px;">
                <?php
                foreach ($pdo->query($sqlGetNewsType) as $key => $resultGetNewsType) {
                    echo "<option value='$resultGetNewsType[news_type_name]'>$resultGetNewsType[news_type_name]</option>";
                }
                ?>
            </select>
        </div>
    </div>
    <div style="height: 20px;"></div>
    <div class="form-group" style="">
        <a style="text-decoration: none;color: #C50C11;font-size: 16px"
           href="javascript:void(0)" onMouseOut="hideImg()"  onmouseover="showImg()">如需要发布视频请看这里</a>
    </div>
    <div class="form-group" style="float:left;margin-left: 60px;">
        <div id="wxImg" style="display:none;height:50px;back-ground:#f00;position:absolute;">
            <img src="images/newsVideoGuide.jpg" alt="">
        </div>
    </div>
    <div class="clear"></div>
    <div style="height: 20px;"></div>
    <div class="label">
        <strong style="font-size: 16px">文章正文内容:</strong>
    </div>
    <div style="height: 10px;"></div>
    <div id="editor">
        <!--        文本主体-->
    </div>
    <!-- 注意， 只需要引用 JS，无需引用任何 CSS ！！！-->
    <script type="text/javascript" src="../wangEditor-3.1.1/release/wangEditor.min.js"></script>
    <script type="text/javascript">
        var E = window.wangEditor;
        var editor = new E('#editor');
        editor.customConfig.debug = location.href.indexOf('wangeditor_debug_mode=1') > 0;
        // 或者 var editor = new E( document.getElementById('editor') )
        // editor.customConfig.uploadImgServer = '/images';  // 上传图片到服务器
        editor.customConfig.uploadImgShowBase64 = true;
        editor.create();
    </script>
    <div class="field" style="padding-top: 20px;">
        <button class="button" id="btn1" style="height: 50px;width: 100px;" type="submit" onclick="copyText()">发布新闻
        </button>
    </div>
    <input type="text" id="field2" name="field2" style="display:none"><br><br>
</form>

<script>
    function copyText() {
        document.getElementById("field2").value = editor.txt.html();
    }
</script>

</body>


</html>

